| |
| スタイルシート「border-width:」では、上下左右のすべての枠線に対し、まとめて線の太さを指定していました。しかし、これらの線の太さを一つひとつ個別に指定することも可能です。「border-top-width:」は上の線の太さについて、同様に「border-bottom-width:」は下の線の太さ、「border-left-width:」は左の線の太さ、「border-right-width:」は右の線の太さを指定できます。また線の太さを「0px」に指定すると、その線だけが表示されなくなります。つまり、上下だけに枠線を表示するといった変則的な枠線を作り出すことも可能なわけです。 |
<P style="border-style:solid ; border-color:#FF9900 ;
border-top-width:10px ; border-bottom-width:1px ;
border-left-width:10px ; border-right-width:1px ;
padding:10px ; margin:20% ; background-color:#FFFFCC">
<FONT size="3" color="#CC0033"><B><U>
CSSを使った枠線
</U></B></FONT><BR>
<FONT size="2" color="#333333"><BR>
CSSを使用すると、このようなデザインのコラムを簡単に作成することができます。枠線の形式や色、余白などを上手に調整して、カッコいいデザインを作成してみてはいかがでしょうか? 上下左右の線の太さを個別に変化させることも、ほら、このとおり!
</FONT>
</P>
|
 |
|